<!doctype html>
<html>
<head>
  <%- partial("../../_header") %>
  <link href="/css/prism.css" rel="stylesheet">
  <style>
    body {
      background-color: rgb(0, 26, 34);
      background: url('sky.jpg');
      color: white;
    }

    ul#magnitudes {
      position: absolute;
      top: 100px;
      left: 30px;
      padding: 0;
      margin: 0;
      list-style: none;
      z-index: 10;
    }

    h1 {
      position: absolute;
      top: 50px;
      left: 5px;
      padding: 0;
      margin: 0;
      z-index: 10;
    }

    canvas {
      position: absolute;
      top: 60px;
      left: 0;
      right: 0;
      bottom: 0px;
      cursor: move;
    }

    #controls {
      position: absolute;
      width: 400px;
      bottom: 5px;
      left: 50%;
      margin-left: -200px;
      text-align: center;
    }

    input[type=range] {
      width: 400px;
    }
  </style>
</head>
<body>
  <%- partial("../../_menu") %>

  <%- yield %>

  <%- partial("../../_scripts") %>
  <script type='text/javascript' src='/js/lib/moment.min.js'></script>
  <script type='text/javascript' src='/examples/quake/quake.js'></script>
  <%- partial("../../_ga") %>
</body>
</html>
